﻿/*THIS STYLE SHEET OVERRIDES ANY STYLING RULES FROM OTHER STYLING SHEETS*/
html {
}

body {
    background-color: whitesmoke;
}

/*GENERAL ERROR/OK TEXT COLORS*/
.error {
    color: red;
}

.ok {
    color: green;
}

.loadingIcon {
    position: absolute;
    top: 0;
    left: 2px;
}

h3 {
    margin: 2px;
}
/*###########*/
/*UI GENERAL STYLING*/
/*###########*/

/*TOP HEADER*/
.ui-layout-header {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: #f9f9f9;
    border-bottom: 1px solid #717171;
    /* IE10 Consumer Preview */
    background-image: -ms-linear-gradient(top, #FFFFFF 0%, #999999 100%);
    /* Mozilla Firefox */
    background-image: -moz-linear-gradient(top, #FFFFFF 0%, #999999 100%);
    /* Opera */
    background-image: -o-linear-gradient(top, #FFFFFF 0%, #999999 100%);
    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(.0, #FFFFFF), color-stop(1, #999999));
    /* Webkit (Chrome 11+) */
    background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #999999 100%);
    /* W3C Markup, IE10 Release Preview */
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #999999 100%);
}
/*UI PANE HEADER*/
.ui-pane-header {
    position: absolute;
    left: 0;
    right: 0;
    height: 25px;
    background: #4D749E;
    color: whitesmoke;
}
/*UI PANE HEADER LABELS*/
.ui-pane-header-label {
    width: 100%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 3px;
    color: whitesmoke !important;
}
/*UI PANE HEADER SEARCH WRAPPER*/
.ui-pane-header-search-wrapper {
    position: absolute;
    right: 2px;
    top: 2px;
    bottom: 2px;
    background: whitesmoke;
}

    .ui-pane-header-search-wrapper > a, .ui-pane-header-search-wrapper > input {
        display: inline-block;
        vertical-align: middle;
        background: whitesmoke;
    }

    .ui-pane-header-search-wrapper > a {
        color: #bbb;
        font-size: 14px;
        padding-left: 4px;
    }


    /*UI PANE HEADER SEARCH TEXT AND INPUT*/
    .ui-pane-header-search-wrapper > div, .ui-pane-header-search-wrapper > input {
        display: inline-block;
        vertical-align: middle;
        margin-top: 3px;
    }
    /*UI PANE HEADER SEARCH TEXT*/
    .ui-pane-header-search-wrapper > div {
    }
    /*UI HEADER SEARCH INPUT*/
    .ui-pane-header-search-wrapper > input {
        border: none;
        margin-right: 3px;
    }

/*UI LAYOUT PANES*/
.ui-layout-west > .ui-layout-center, .ui-layout-west > .ui-layout-south,
.ui-layout-east > .ui-layout-center, .ui-layout-east > .ui-layout-south,
.ui-layout-center > .ui-layout-center, .ui-layout-center > .ui-layout-south > .ui-layout-center {
    border: 1px solid #181818;
}

/*UI RESIZER AND TOGGLER*/
.ui-layout-resizer, .ui-layout-toggler {
    /*set animation speed of background*/
    -webkit-transition: background.4s linear;
    -moz-transition: background .4s linear;
    -o-transition: background .4s linear;
    transition: background .4s linear;
    border: background none;
}

/*RESIZING BARS*/
.ui-layout-resizer {
    border: none;
    background: #012775;
    /* Mozilla Firefox */
    background-image: -moz-radial-gradient(center, circle farthest-side, #DADADA 0%, #C4C4C4 50%, #999999 100%);
    /* Opera */
    background-image: -o-radial-gradient(center, circle farthest-side, #DADADA 0%, #C4C4C4 50%, #999999 100%);
    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(radial, center center, 0, center center, 487, color-stop(0, #DADADA), color-stop(0.4, #C4C4C4), color-stop(1, #999999));
    /* Webkit (Chrome 11+) */
    background-image: -webkit-radial-gradient(center, circle farthest-side, #DADADA 0%, #C4C4C4 50%, #999999 100%);
    /* W3C Markup, IE10 Release Preview */
    background-image: radial-gradient(circle farthest-side at center, #DADADA 0%, #C4C4C4 50%, #999999 100%);
    background-repeat: repeat;
    -webkit-background-size: 200% 200%;
    -moz-background-size: 200% 200%;
    background-size: 200% 200%;
}

    .ui-layout-resizer:hover {
        background-position: 0 -100%;
    }

/*RESIZIING TOGGLER*/
.ui-layout-toggler {
}

    .ui-layout-toggler:hover {
        background-color: #414042;
    }

/*RESIZING SIDE BARS CLOSED ANCHOR TAG ICON*/
.ui-layout-toggler-closed a {
    position: absolute;
    top: 30%;
    width: 16px;
    height: 16px;
    left: 0;
    color: #181818;
}

.ui-layout-toggler > a {
    font-size: 16px !important;
}

.ui-layout-toggler-closed:hover > a {
    /*change icon color on "button" hover*/
    color: #c2c2c2;
}

/*RESIZING SIDE BAR CLOSED EAST (RIGHT SIDE) ANCHOR TAG ICON*/
.ui-layout-toggler-east-closed a {
    /*this flips the image horizontally to reuse the same image*/
    /*-moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    -ms-filter: fliph; /*IE*/
    /*filter: fliph; /*IE*/
}

/*RESIZING BARS OPEN*/
.ui-layout-resizer-open {
}

/*RESIZING BARS OPEN ANCHOR TAG ICON*/
.ui-layout-toggler-open a {
    display: none;
}

    .ui-layout-toggler-open a:hover {
    }

/*UI RESIZER SOUTH (HORIZONTAL)*/
.ui-layout-resizer-south {
}

    .ui-layout-resizer-south:hover {
        background-position: -100% 0;
    }

/*WEST LAYOUT / TOGGLE BUTTON*/
.ui-layout-toggler-west-closed {
}

/*ICON STYLING*/

/*ALL ICONS*/
[class^="icon-"], [class*=" icon-"] {
    font-size: 22px;
    color: #181818;
}
/*UI FOCUS ITEMS*/
.ui-state-focus {
    border-color: #013d98 !important;
}

/*UI STYLING DIALOG WINDOW*/
.ui-dialog {
    box-shadow: 2px 2px 2px #414042;
    padding: 0;
}

.ui-dialog-content {
    background: #eeeeee !important;
}
/*UI STYLING DIALOG TITLE*/
.ui-dialog > .ui-dialog-titlebar {
    background: #4D749E;
    color: whitesmoke;
}

/*UI DIALOG BUTTON PANE*/
.ui-dialog > .ui-dialog-buttonpane {
    padding: 0;
    margin: 0;
    background: #88919c;
}

/*UI DIALOG BUTTONS*/
.ui-button-text-only .ui-button-text {
    padding: 0.3em .6em;
}

.ui-dialog-buttonset > button:hover > span {
    /*font-weight: 700;*/
    color: #013d98;
}
/*DIALOG CLOSE BUTTON HIDE CLASS*/
.no-close .ui-dialog-titlebar-close {
    display: none;
}
/*UI DIALOG INPUT*/
input:focus {
    outline: 0 none;
}

/*UI DIALOG TABS*/
.ui-tabs-nav > .ui-state-active {
    border-color: #6a83a8;
}
#headerDiv .ui-tabs .ui-tabs-nav li.ui-tabs-active {
padding-bottom: 2px;
}

ul.ui-tabs-nav > li > a {
    cursor: default !important;
}

.ui-tabs-nav > li.ui-state-focus > a {
    border: none;
}
/*UI DIALOG SETTINGS AUTOCOMPLETE DROP DOWN*/
.ui-autocomplete > li > a, .ui-autocomplete > li {
    border: none !important;
    margin: 0 !important;
}

    .ui-autocomplete > li > a.ui-state-focus {
        background: rgba(95, 122, 157, 0.30) !important;
        color: #013d98;
        margin: 0 !important;
    }

/*UI DIALOG LINKS HOVER*/
.contextDialog > div.dialogFillTop > a:hover {
    color: #013d98;
}

a:focus, .rebootFlush:focus, .rebootDisabled:focus {
    border: 1px solid #013d98;
    outline: 0 none;
}

button[type=button]:focus, .ui-dialog-titlebar-close {
    box-shadow: none;
    outline: none;
}
/*SETTINGS WRAPPER*/
.settingsWrapper {
    margin: 10px 0 5px 10px;
}

    .settingsWrapper > label, .settingsWrapper > span, .settingsWrapper > button, .settingsWrapper > p {
        display: inline-block;
        vertical-align: middle;
    }

    .menuSettingsGeneral label {
    width:50px;
    text-align:center;
}

/*UI DIALOG SPINNER*/
.tcContextDialogSpinner:focus {
    border: none;
}

.dialogFillBottom > label, .dialogFillBottom > span, .dialogFillBottom > input {
    display: inline-block;
    vertical-align: middle;
}

.dialogFillBottom > span {
    padding: 2px;
    margin-left: 2px;
}

    .dialogFillBottom > span > input {
        vertical-align: middle;
        margin-top: 0;
    }

/*UI DIALOG SETTINGS*/
.resetSettingsBtn:hover {
    color: #013d98;
}
/*INITIAL HIDE OF SETTIGS DIALOG*/
.mainMenuDialog {
    display: none;
    padding: 0 !important;
}

.mainMenuSettingsTabs {
    border: none;
}
/*AUTO COMPLETE BOX*/
.ui-autocomplete {
    position: absolute;
    z-index: 101;
}
/*DIALOG SETTINGS FIELDSETS*/
fieldset {
    border: 1px solid #013d98;
    border-radius: 0px;
}
/*DISCOVERY SLICKGRID*/
.tcDiscoveryIpWrapper {
    position: absolute;
    left: 10px;
    top: 65px;
    right: 180px;
    bottom: 60px;
    border: 1px solid #013d98;
}
/*TCDISCOVERY INFO*/
.tcDiscoveryIpInfoWrap {
    position: absolute;
    left: 8px;
    top: 355px;
    right: 178px;
    bottom: 10px;
}

.tcDiscoveryIpView {
    /*using overrides to prevent bubbling of tcListView class*/
    top: 0px !important;
    bottom: 0px !important;
    left: 0px !important;
    right: 0px !important;
}
/*DISCOVERY IP LIST -> SLICKGRID VIEWPORT*/
.tcDiscoverySettingsView > .slick-viewport {
    overflow-x: hidden !important;
}

/*DISCOVERY SLICKGRID HEADER*/
.tcDiscoveryIpView > .slick-header {
    border: none;
}
    /*DISCOVERY SLICKGRID HEADER COLUMNS*/
    .tcDiscoveryIpView > .slick-header > .slick-header-columns > .slick-header-column {
        border-left: none !important;
    }
/*DISCOVERY SLICKGRID CHECKBOXES*/
.tcDiscoveryCheckBox {
    vertical-align: middle;
    margin: 3px;
}

/*DISCOVERY SLICKGRID IP EDITING FIELDS*/
.ipInputWrapper {
    padding: 1px;
    padding-bottom: 5px;
}
/*IP INPUT FIELDS*/
input[name="number"] {
    width: 25px;
}

/*DISCOVERY ADD IP RANGE BUTTON WRAPPER*/
.addIpRangeWrapper {
    position: absolute;
    top: 58px;
    right: 15px;
}
/*ADD IP BUTTON*/
.addIpButtonWrapper {
    margin-top: 4px;
}

    .addIpButtonWrapper > button {
        margin: 0;
    }

/*DISCOVERY IP BUTTONS*/
.discoveryButtonWrapper {
    position: absolute;
    bottom: 25px;
    right: 30px;
}

    .discoveryButtonWrapper > button {
        display: block;
        width: 100%;
        margin-top: 10px;
    }

/*DIALOG COLLAPSABILE*/
.tcProperties-tcDialog {
    display: none;
}

.collapsible-trigger {
    height: 20px;
    background: #88919c;
    border-bottom: 1px solid #181818;
    color: whitesmoke;
    cursor: pointer;
}

    .collapsible-trigger:hover {
        color: #013d98;
    }

#dialogColl1, #tcInfoColl1 {
    border-top: 1px solid #181818;
}

.collapsible-container {
    border-left: 15px solid #c5c5c5;
    background: whitesmoke;
}

.collapsible-indicator, .collapsible-text {
    display: inline-block;
    padding: 1px;
}

.collapsible-trigger.collapse-open > .collapsible-indicator:after {
    content: attr(Collapsible-open) "\25bc";
    color: #181818;
    padding-top: 5px;
    padding-left: 2px;
    font-size: small;
    color: whitesmoke;
    /*text-shadow: 1px 1px #181818;*/
}

.collapsible-trigger.collapse-close > .collapsible-indicator:after {
    content: attr(Collapsible-open) "\25ba";
    color: #181818;
    padding-top: 5px;
    padding-left: 2px;
    font-size: small;
    color: whitesmoke;
    /*text-shadow: 1px 1px #181818;*/
}

.not-selectable-wrapper {
    background: whitesmoke;
}

.not-selectable-info, .not-selectable-value {
    padding-left: 5px;
    padding-right: 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-bottom: 1px solid #181818;
}

.not-selectable-info {
    min-width: 145px;
    display: table-cell;
}

.not-selectable-value {
    display: table-cell;
    width: 100%;
}

.not-selectable {
    moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    color: rgba(24, 24, 24, .8);
    cursor: default;
}

.not-selectable-info > div:not(.ui-resizable-handle) {
    border-right: 1px solid #181818;
    border-left: 1px solid #181818;
}

.not-selectable-value > div {
    border-right: 1px solid #181818;
}

.ui-resizable-helper-tcprop {
    border: 1px solid #013d98 !important;
}
/*###########*/
/*TC LIST *CENTER* STYLING*/
/*###########*/

/*UI CENTER, CENTER | UI LAYOUT, SOUTH, CENTER | HIDING OVERFLOW*/
.ui-layout-center > .ui-layout-center, .ui-layout-center > .ui-layout-south > .ui-layout-center {
    overflow: hidden;
}

/*TCGRIDHEADER SEARCH SPAN AND TEXTBOX*/
.ui-pane-header > span {
    /*wrapped span*/
    position: absolute;
    top: 2px;
    right: 2px;
}

    .ui-pane-header > span > input {
        /*textbox*/
        border: none;
    }

/*TCLIST VIEW (TOTAL DIV FOR THINCLIENT LIST)*/
.tcListView {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0;
    right: 0;
}

/*TCLIST ICONS*/
.tcListIcons {
    display: inline-block;
    color: whitesmoke;
}

    .tcListIcons:hover {
        cursor: pointer;
    }

    .tcListIcons > img {
        height: 24px;
        width: 24px;
        padding-top: 1px;
    }

/*SLICK HEADER COLUMNS*/
.slick-header-column:hover {
    background: none;
    font-weight: 700;
    color: #013d98;
}

/*SLICK ROW HOVERED*/
.slick-row:hover, .slick-row.odd:hover, .slick-row:hover > .slick-cell.selected {
    font-weight: 700;
    color: #013d98;
    background: rgba(95, 122, 157, 0.30);
}

/*ODD ROWS*/
.slick-row.odd {
    background: #e2e2e2;
}

/*SELECTED CELL*/
.slick-row.selected .cell-selection {
    background-color: transparent; /* show default selected row background */
}
/*EDITABLE CELLS*/
input.editor-text {
    background: whitesmoke;
}
/*EACH CELL OF THINCLIENT LIST*/
.slick-cell {
    border: none;
    border-right: 1px dotted silver;
    line-height: 23px;
}

    /*CURRENT ACTIVE CELL*/
    .slick-cell.active {
        border: none;
        border-right: 1px dotted silver;
    }

    /*CURRENT SELECTED CELL(S)*/
    .slick-cell.selected {
        background-color: #82a2d1;
        color: whitesmoke;
        border-top: 1px solid #6a83a8;
        border-bottom: 1px solid #6a83a8;
    }

/*CELLS THAT HAVE STATUS IMAGES*/
.tcStatusImg {
    /*vertical-align: middle;*/
    margin-left: auto;
    margin-right: auto;
    margin-top: -2px;
    vertical-align: middle !important;
}

/*CELL NAME ATTRIBUTE*/
.cell-title {
    font-weight: bold;
}

.cell-effort-driven {
    text-align: center;
}

.cell-selection {
    border-right-color: silver;
    border-right-style: solid;
    background: #f5f5f5;
    color: gray;
    text-align: right;
    font-size: 10px;
}

/*TCLOGLIST LOADING INDICATOR*/
.tcLogLoading {
    width: 100%;
    vertical-align: middle;
    height: 75%;
}

/*TCLISTPAGER (BOTTOM DIV OF THINCLIENT LIST)*/
.tcListPager {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 26px;
}

.slick-pager {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    border: none;
    height: 26px;
    background: #88919c;
    /*background: #5E7185;*/
    color: whitesmoke;
}

/*TCLISTPAGER BOTTOM ICONS HOVER*/
.ui-state-hover {
    color: #013d98;
}

/*CENTERING WRAPPER FOR LOADING ICON*/
.loadingModalMask {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    /*no opacity declaration, due to inheritance!*/
    background: rgba(245,245,245,0.6);
    z-index: 10;
    display: none;
}

.centerWrapper {
    /*margin: 35% auto 0 auto;*/
    border: 1px solid #014d98;
    background: #4d749e;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    color: whitesmoke;
}

.loading-gif, .loading-text {
    display: table-cell;
    vertical-align: middle;
    padding: 5px 5px 2px 5px;
}

.loading-text {
    padding-right: 10px;
}

/*LOADING INDICATOR FOR THIN CLIENT LIST*/
.loading-indicator {
    position: absolute;
    top: -45%;
    left: -45%;
    display: inline-block;
    padding: 12px;
    background: white;
    font-weight: bold;
    border: 1px solid #181818;
    -moz-box-shadow: 0 0 5px #013d98;
    -webkit-box-shadow: 0px 0px 5px #013d98;
    z-index: 100;
}

    .loading-indicator label {
        padding-left: 20px;
        background: url('../images/ajax-loader-small.gif') no-repeat center left;
    }

/*SLICK COLUMN PICKER CONTEXT MENU*/
.slick-columnpicker {
    width: 150px;
    height: auto;
    background: whitesmoke;
    border: 1px solid #919191;
    box-shadow: 2px 2px 2px #666;
    padding: 5px 5px 7px 0px;
    margin: 0;
}

/*ELEMENTS OF THE COLUMNPICKER CONTEXT MENU  */
.cp-container {
    position: relative;
    display: block;
    width: 100%;
    height: 22px;
}

    .cp-container:hover {
        font-weight: 700;
        color: #013d98;
    }

    /*COLUMNPICKER CONTEXT INPUTS AND NOT RESET BUTTON*/
    .cp-container input:not(.resetColumns) {
        cursor: pointer;
        padding: 2px;
    }

/*COLUMN PICKER CONTEXT MENU LABEL TEXT *DIV* */
.cp-label {
    cursor: default;
    padding: 2px;
}

    .cp-label:hover {
    }

/*COLUMN PICKER CONTEXT MENU TEXT AND INPUTS*/
.cp-container input:not(.resetColumns), .cp-label {
    float: left;
    vertical-align: middle;
}
/*COLUMN PICKER CONTEXT MENU RESET BUTTON*/
.cp-container > .resetColumns {
    position: absolute;
    left: 18px;
    right: 15px;
}

    .cp-container > .resetColumns:hover {
        color: #013d98;
        font-weight: 700;
    }
/*COLUMN PICKER CONTEXT MENU LINE BREAK FOR*/
.hr {
    background: #e2e2e2;
    padding: 0px 0 0px 0;
}

/*SLICK CONTEXT MENU FOR THINCLIENTS*/
.context-menu-list {
    max-width: none;
    width: auto;
    border: 1px solid #919191;
}

/*SLICK CONTEXT MENU ITEM */
.context-menu-item {
    padding: 4px 2px 4px 15px;
}

/*SLICK CONTEXT MENU ITEM *LI* HOVER, NO SEPERATOR*/
.context-menu-list > li:not(.context-menu-separator .disabled):hover {
    background: rgba(95, 122, 157, 0.30);
}
/*SLICK CONTEXT MENU ITEM TEXT*/
.context-menu-item > span {
    padding: 5px 25px 5px 5px;
    white-space: nowrap;
}

/*SLICK CONTEXT MENU SUB MENU */
.context-menu-item > li > ul {
    width: auto;
    max-width: none;
}

/*SLICK CONTEXT MENU SIDE STYLE BAR */
.context-menu-list-sidebar {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 15px;
    background: #c5c5c5;
}
/*SLICK CONTEXT MENU DISABLED ITEM*/
.disabled {
    cursor: default;
}

/*SLICK CONTEXT MENU SEPERATOR*/
.context-menu-separator {
    padding: 0;
    border-color: #bebebe;
    margin-left: 15px;
}
    /*SLICK CONTEXT MENU SEPARATOR, SELECT SIDE BAR*/
    .context-menu-separator > .context-menu-list-sidebar {
        margin: 0 0 -1px -15px;
    }

/*SLICK CONTEXT MENU INSERTING TRIANGLE INTO MENU*/
.context-menu-submenu:after {
    content: attr(VNCPrompt-check) "\25ba";
    color: #181818;
    padding-top: 5px;
    padding-left: 2px;
    font-size: smaller;
}

/*SLICK CONTEXT MENU TRAINGLE DISABLED*/
.context-menu-item.context-menu-submenu.disabled:after {
    color: #a5a5a5;
}

/*SLICK CONTEXT MENU INSERTING CHECK MARK INTO SIDE BAR*/
/*ADDED AND REMOVED THROUGH JQUERY*/
.context-menu-list-sidebar.context-checkmark:after {
    content: "\2714";
    color: #181818;
    padding: 2px;
    font-size: small;
    vertical-align: middle;
}
/*SLICK PAGER EXPANDED OUT > A TAGS HOVER*/
span.slick-pager-settings-expanded > a:hover {
    vertical-align: baseline;
}

span.slick-pager-settings-expanded > a:hover {
    color: #181818;
}

/*TC PROP STYLING*/
.tcInfo-leftWrapper {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 150px;
    overflow: visible;
}

.tcInfo-rightWrapper {
    position: absolute;
    top: 0;
    left: 150px;
    bottom: 0;
    right: 0px;
}

.tcInfo-header {
    height: 25px;
    background: #A9B4C0;
    display: block;
}

.tcInfo-title {
    white-space: nowrap;
}

.tcInfo-label, .tcInfo-value {
    display: block;
    background: #f5f5f5;
    white-space: nowrap;
}

.odd {
    background: #e2e2e2;
}

.tcInfo-label, .tcInfo-value {
    display: block;
    height: 27px;
    line-height: 28px;
}

    .tcInfo-value:hover {
        font-weight: 700;
        color: #013d98;
        background: rgba(95, 122, 157, 0.30);
    }

.tcInfo-label {
    text-align: right;
    padding-right: 5px;
    border-right: 1px dotted silver;
    border-bottom: none;
}

.tcInfo-value {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-left: 5px;
    border: none;
}

.tcInfo-title {
    line-height: 25px;
    padding-left: 10px;
}
/*###########*/
/*TC TREE STYLING*/
/*###########*/

/*OVERALL TC Tree*/
#tcTreeView {
    position: absolute;
    top: 25px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    overflow-x: hidden;
    background: whitesmoke;
    padding-left: 8px;
}

/*LI ELEMENTS*/
.jqtree-element.jqtree_common {
}

.jqtree-element:hover {
    color: #013d98;
    background: rgba(95, 122, 157, 0.30);
}

    .jqtree-element:hover > .jqtree_common {
        font-weight: 700;
        color: #013d98;
    }

/*SELECTED "FOLDER" NODE*/
ul.jqtree-tree li.jqtree-folder {
    margin-bottom: 0px;
}

/*SELECTED NODE ATTR*/
ul.jqtree-tree li.jqtree-selected > .jqtree-element, ul.jqtree-tree li.jqtree-selected > .jqtree-element:hover {
    background: #82a2d1;
}

li.jqtree-selected > div.jqtree-element > div.jqtree-title {
    color: whitesmoke;
}

/*DIV CONTAINERS OF THE NODES */
li.jqtree_common > div.jqtree_common {
    padding: 2px 7px 2px 0px;
}

/*ANCHOR TAGS *TRIANGLES* */
li.jqtree_common > div.jqtree-element > a.jqtree-toggler {
    line-height: normal;
    top: 0;
    padding: 1px 0 2px 0;
    color: #4d4d4d;
}

    li.jqtree_common > div.jqtree-element > a.jqtree-toggler:hover {
        color: #013d98;
    }

/*TEXT NODE*/
li.jqtree_common > div.jqtree-element > div.jqtree-title {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding: 0 8px 0 0px;
}

/*###########*/
/*TC TREE GROUP INFO *WEST* STYLING*/
/*###########*/

/*BOTTOM WEST DIV WITH NODE *GROUP* INFO*/
.ui-layout-tctreedata {
    position: absolute;
    top: 25px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    overflow-x: hidden;
    background: #cecece;
    color: #181818;
}

/*TREE NODE | THINCLIENT GROUP INFO DIVS*/
.groupInfo-leftWrapper {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100px;
}

.groupInfo-rightWrapper {
    position: absolute;
    top: 0;
    left: 100px;
    bottom: 0;
    right: 0px;
}

.groupInfo-label:nth-child(odd), .groupInfo-value:nth-child(odd) {
    background: #e2e2e2;
}

.groupInfo-label, .groupInfo-value {
    display: block;
    height: 27px;
    line-height: 28px;
    background: #f5f5f5;
}

    .groupInfo-value:hover {
        font-weight: 700;
        color: #013d98;
        background: rgba(95, 122, 157, 0.30);
    }

.groupInfo-label {
    text-align: right;
    padding-right: 5px;
    border-right: 1px dotted silver;
    border-bottom: none;
}

.groupInfo-value {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-left: 5px;
    border: none;
}

/*###########*/
/*TC SPECIFIC *EAST* STYLING*/
/*###########*/

/*TCACTION DIV*/
.ui-layout-tcaction {
    position: absolute;
    top: 25px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    background: inherit;
    padding-right: 8px;
    color: #181818;
    background: whitesmoke;
}


/*TCINFO DIV*/
.ui-layout-tcprop {
    position: absolute;
    top: 25px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    overflow-x: hidden;
    color: #181818;
    background: #cecece;
}

/*SLIDER*/
h2-macSlider {
    white-space: nowrap;
}

.slideNav-macSlider {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    border: 1px solid lime;
    height: 48px;
    overflow: hidden;
    background: #181818;
}

.back-macSlider, .forward-macSlider {
    height: 48px;
    width: 48px;
    cursor: pointer;
    z-index: 10;
}

.back-macSlider {
    position: absolute;
    top: 0;
    left: 0;
    background: yellow;
    color: blue;
}

.forward-macSlider {
    position: absolute;
    top: 0;
    right: 0;
    background: yellow;
    color: blue;
}

.title-macSlider {
    position: absolute;
    top: 0;
    left: 0px;
    right: 0px;
    bottom: 0;
    text-align: center;
    background: #999;
}

.macSlider {
    position: absolute;
    top: 48px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    border: 1px solid blue;
}

.slide {
    position: absolute;
    top: 0px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: auto;
}

/*###########*/
/*TC PROPERTIES*/
/*###########*/

/*DIALOG COLLAPSABILE*/
.tcProperties-tcInfoCenter {
    display: none;
}

input.commentInput {
    width: 95%;
}

/*###########*/
/*TC PROPERTIES*/
/*###########*/

.tcAddScheduledTask {
    /*position:absolute;
    left:40%;
    top:30%;
    z-index:10;*/
    display: none;
    background: #f4f4f4;
}

/*###########*/
/*ADD TASK WIZARD*/
/*###########*/
.addTaskWizard {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}

.addTaskBody, .addTaskHeader {
    display: block;
    background: #eee;
    overflow: hidden;
}

.addTaskHeader {
    border-bottom: 1px solid #013d98;
}

.addTaskBody {
    padding-bottom: 78px;
}

.addTaskHeader > h1 {
    text-align: center;
    background: #B6B5B5;
    font-size: 16px;
    padding: 4px;
    margin-top: 0;
}

.addTaskHeader > p {
    margin-left: 10px;
    padding-right: 10px;
    white-space: nowrap;
}

.addTaskHeader {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    height: 70px;
}

.addTaskBody {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 71px;
    bottom: 0px;
}

    /*SELECT TASK*/
    .addTaskBody > .addTaskBodyName, .addTaskBody > .addTaskBodySelect {
        display: block;
        padding: 10px;
        margin-right: 10px;
    }

        .addTaskBody > .addTaskBodyName > input, .addTaskBody > .addTaskBodySelect > input {
            width: 100%;
            margin-top: 5px;
        }

        .addTaskBody > .addTaskBodyName > label, .addTaskBody > .addTaskBodySelect > label {
            width: 100%;
            margin-top: 5px;
            font-size: 12px;
        }

        .addTaskBody > .addTaskBodySelect > div > select {
            margin-top: 5px;
            padding: 2px;
        }

.addTaskName {
    display: block;
}

.addTaskSelect {
    display: inline;
}

.addTaskSelectDate {
    cursor: pointer;
    padding-left: 2px;
}

.tcFirmwareList {
    border: 1px solid #666;
    background: whitesmoke;
}

    .tcFirmwareList > div {
        display: inline-block;
        width: 128px;
        vertical-align: top;
        padding: 2px;
    }

        .tcFirmwareList > div > div {
            cursor: pointer;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            margin-bottom: 2px;
            margin-left: 2px;
            padding: 1px;
            color: #181818;
        }

            .tcFirmwareList > div > div:hover {
                color: #013d98;
                outline: 1px solid #013d98;
            }

            .tcFirmwareList > div > div.active {
                background: #82a2d1;
                color: whitesmoke;
                outline: 1px solid #6a83a8;
            }

/*UPLOADING PROGRESS*/
.tcFirmwareUpload {
}

.tcFirmProgLabel, .tcInstallFirmProgLabel, .tcUninstallFirmProgLabel {
    text-align: center;
    margin-top: 18px;
}

/*SELECT SCHEDULE*/
.addTaskFreq > div > span, .addTaskFreq > div > div, .addTaskFreq > div > select, .addTaskFreq > div > input, .addTaskTimeGroup > div, .addTaskTimeGroup > span {
    vertical-align: middle;
    display: inline-block;
}


.addTaskFreq {
    padding: 10px 10px 0px 10px;
}

    .addTaskFreq > div {
        padding: 5px;
    }

.addTaskOptions {
    padding: 10px;
    display: none;
}

.addTaskFreq > div > input, .addTaskFreq > div > span, .addTaskTimeGroup > span {
    width: 150px;
}

.addTaskFreq > div > select {
    width: 154px;
}

.addTaskFreq > div > div, .addTaskTimeGroup > div {
    width: 70px;
    text-align: right;
}

.addTaskTimeGroup {
    margin-left: 6px;
    margin-top: 10px;
}

    .addTaskTimeGroup > div, .addTaskTimeGroup > span {
        display: inline-block;
    }

.addTaskFreqDays > input, .addTaskFreqDays > div {
    display: inline-block;
    vertical-align: middle;
}

    .addTaskFreqDays > input:hover {
        cursor: pointer;
    }
/*ADD TASK SUMMARY*/
.addTaskSummary > div {
    display: block;
    margin-left: 10px;
}

    .addTaskSummary > div > h2 {
        border: none;
    }

    .addTaskSummary > div > h2, .addTaskSummary > div > p {
        display: block;
    }

    .addTaskSummary > div > h2 {
        padding: 4px 4px 4px 0;
        margin-right: 10px;
    }

    .addTaskSummary > div > p {
        margin-left: 4px;
        padding-right: 10px;
    }

/*###########*/
/*EDIT SCHEDULED TASK*/
/*###########*/

.tcEditScheduledTask > .slick-viewport > .grid-canvas {
    padding-left: .5px;
}

.editTaskDialog > .ui-dialog-buttonpane > .ui-dialog-buttonset {
    width: 99%;
}

#editTaskCloseBtn {
    float: right;
}

/*###########*/
/*EDIT SCHEDULED TASK WINDOW*/
/*###########*/
.tcEditTaskWindow > div {
    /*wrapper row divs*/
    display: block;
    margin-top: 9px;
}

    .tcEditTaskWindow > div > div, .tcEditTaskWindow > div > input,
    .tcEditTaskWindow > div > select, .tcEditTaskWindow > div > textarea {
        display: inline-block;
    }

        .tcEditTaskWindow > div > div:not(.etwIntWrap,.etwFWWrap), .etwIntWrap > div {
            /*lables*/
            width: 70px;
            text-align: left;
            padding-left: 5px;
        }

    .tcEditTaskWindow > div > input, .tcEditTaskWindow > div > select {
        /*inputs*/
        width: 250px;
    }

.editTaskFreqDays > input, .editTaskFreqDays > div, .etwIntWrap > div, .etwIntWrap > span {
    display: inline-block;
}

.tcEditTaskWindow > div > button {
    position: relative;
}

.tcEditTaskWindow > div > textarea {
    width: 280px;
    margin-right: 10px;
}

.editTaskSelectDate, .addTaskSelectDate {
    cursor: pointer;
}

.editTaskTimeSpinner, .addTaskTimeSpinner {
    cursor: default;
}

.etwFWWrap {
    display: block !important;
}

    .etwFWWrap div {
        display: inline-block;
        padding: 5px;
    }



/*###########*/
/*MOVE TC*/
/*###########*/
.mouseFollow {
    position: absolute;
    z-index: 20;
    background: whitesmoke;
    /*border: 1px solid #888;
    box-shadow: 1px 1px 1px #181818;*/
}

.tcMove {
    padding: 5px;
}

/*###########*/
/*MOVE TO GROUP */
/*###########*/
.moveOption div, .moveOption select {
    display: block;
    margin-top: 5px;
    margin-bottom: 10px;
}

.moveOption select {
    width: 260px;
}

/*###########*/
/*NEW GROUP */
/*###########*/
.treeGrpTop > div > div, .treeGrpTop > div > input, .treeGrpTop > div > button {
    display: inline-block;
    vertical-align: middle;
}
.treeGrpTop > div {
margin-top: 7px;
}

.treeGrpTop > div:nth-child(3) {
    /*select the last div*/
    margin: 14px;
}

.treeGrpTop > div > div:not(:nth-child(2)):not(.tgConfigBtns) {
    /*select only the first 2, name and desc*/
    text-align: right;
    width: 75px;
    margin-right: 8px;
}

.treeGrpTop > div > input:not(:nth-child(1)) {
    /*top inputs*/
    width: 180px;
}

.treeGrpTop > div > button {
    /*top buttons*/
    font-size: 12px;
    float: right;
}

.treeGrpBtm > div {
    /*both left - right divs*/
    display: inline-block;
    vertical-align: top;
}

.treeGrpBtm fieldset {
    /*both left - right fieldset*/
    width: 262px;
}

    .treeGrpBtm fieldset > legend > input {
        /*fieldset legends and inputs*/
        vertical-align: middle;
        margin-top: 0;
    }

/*filter platform*/
.tgLeft, .tgRight {
    display: inline-block;
    vertical-align: top;
    margin-left: 10px;
}

.treeGrpPlatform input[type="radio"] {
    margin: 0;
}

.tgLeft > div {
    display: block;
    margin-top: 10px;
}

    .tgLeft > div > div, .tgRight > div:nth-child(1) > div {
        margin-left: 7px;
    }

    .tgLeft > div > input, .tgLeft > div > div {
        display: inline-block;
        vertical-align: middle;
    }

.tgRight > div {
    margin-top: 10px;
    margin-bottom: 5px;
}

    .tgRight > div:nth-child(1) > input, .tgRight > div:nth-child(1) > div {
        display: inline-block;
        vertical-align: middle;
    }

    .tgRight > div:nth-child(2) {
        margin-top: 0px;
        margin-left: 15px;
        margin-bottom: 10px;
    }

        .tgRight > div:nth-child(2) > div {
            display: block;
        }

            .tgRight > div:nth-child(2) > div > input, .tgRight > div:nth-child(2) > div > div {
                display: inline-block;
                vertical-align: middle;
            }

fieldset.treeGrpPlatform > div:nth-child(2), fieldset.treeGrpModel > div, fieldset.treeGrpVersion > div, fieldset.treeGrpMAC > div, fieldset.treeGrpCompName > div {
    display: block;
    margin: 8px;
}

fieldset.treeGrpModel > div, fieldset.treeGrpVersion > div, fieldset.treeGrpMAC > div, fieldset.treeGrpCompName > div {
    display: block;
    margin: 8px;
}

.treeGrpBtm {
    margin-top: 15px;
}

    .treeGrpBtm fieldset {
        margin-bottom: 8px;
    }

        .treeGrpBtm fieldset button {
            margin-top: 10px;
            margin-left: 65px;
        }

.treeGrpLeft fieldset:nth-child(1), .treeGrpRight fieldset:nth-child(1) {
    height: 130px;
}

.treeGrpLeft fieldset:not(:nth-child(1)), .treeGrpRight fieldset:not(:nth-child(1)) {
    height: 110px;
}

fieldset.treeGrpIP > div:nth-child(3) {
    margin-left: 35px;
    margin-top: 10px;
}

fieldset.treeGrpIP .ipInputWrapper {
    margin-top: 5px;
}

    fieldset.treeGrpIP .ipInputWrapper div, fieldset.treeGrpIP .ipInputWrapper input {
        display: inline-block;
    }

    fieldset.treeGrpIP .ipInputWrapper div {
        vertical-align: bottom;
        margin-left: 2px;
    }

        fieldset.treeGrpIP .ipInputWrapper div:nth-child(1) {
            text-align: right;
            width: 30px;
            vertical-align: middle;
            margin-right: 5px;
        }

    fieldset.treeGrpIP .ipInputWrapper input {
        margin: 0;
        vertical-align: middle;
    }

.tgConfigBtns {
    margin-left: 30px;
}

button#tgHideOpts {
    position: absolute;
    left: 15px;
}

/*Group Add Filter Dialogs*/
.tcNewGroupList > div {
    color: #181818;
}

    .tcNewGroupList > div.active {
        background: #82a2d1;
        color: whitesmoke;
        outline: 1px solid #6a83a8;
    }

.tcNewGroupList {
    outline: 1px solid #013d98;
    margin-top: 10px;
    height: 150px;
    overflow-y: auto;
    background: whitesmoke;
}

    .tcNewGroupList > div:hover {
        color: #013d98;
        outline: 1px solid #013d98;
    }

.tcNewGroupListButtons {
    margin-top: 10px;
}

    .tcNewGroupListButtons > button {
        margin-left: 2px;
    }

.filterAdd > div, .filterAdd > input {
    display: inline-block;
    vertical-align: middle;
}

.filterAdd > input {
    margin-left: 10px;
    width: 250px;
}

/*selected FW*/
.tgTempSelectedWrap {
    margin: 10px;
    width: auto !important;
    text-align: left !important;
    margin-left: 24px;
}

    .tgTempSelectedWrap > div {
        display: inline-block;
        color: #ccc;
    }

.tgTempSelected {
    margin-left: 10px;
}

/*###########*/
/*CLONE FROM ANOTHER */
/*###########*/
img.cloneAnotherIcon {
    vertical-align: middle;
}

img.cloneAnotherIcon {
    vertical-align: middle;
}

.tcCloneAnotherDialog > div {
    margin-top: 5px;
}

div#tcCloneAnotherView {
    margin-top: 10px;
    bottom: 0px !important;
}

/*###########*/
/*NEW COMP NAME */
/*###########*/
input.newCompName {
    width: 98%;
}

/*###########*/
/*GEN TEMPLATE */
/*###########*/
.selTemplateName, .templateName {
    display: inline-block;
}

.templateName {
    width: 250px;
    margin-left: 5px;
}

/*###########*/
/*Apply TEMPLATE */
/*###########*/

.tcTempList {
    border: 1px solid #666;
    background: whitesmoke;
    position: absolute;
    overflow: auto;
    left: 10px;
    right: 10px;
    bottom: 40px;
    top: 50px;
}

.applyTempWrap {
    margin: 2px 0 2px 0;
}

    .applyTempWrap > img, .applyTempWrap > div {
        display: inline-block;
        vertical-align: middle;
    }

.tcTempList > div:hover {
    color: #013d98;
    outline: 1px solid #013d98;
}

.tcTempList > div.active {
    background: #82a2d1;
    color: whitesmoke;
    outline: 1px solid #6a83a8;
}

    .tcTempList > div.active > div {
        color: whitesmoke;
    }

.tempPushWrap {
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 10px;
}

    .tempPushWrap > input, .tempPushWrap > div {
        display: inline-block;
        vertical-align: middle;
    }

    .tempPushWrap > div {
        margin-left: 10px;
    }


/*###########*/
/*DELETE TC*/
/*###########*/
.deleteConfigWrap > input, .deleteConfigWrap > div {
    display: inline-block;
    vertical-align: middle;
}

/*###########*/
/*ONLINE MANUAL*/
/*###########*/
.onlineMan {
}
/*manual left side*/
.manLeft {
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:150px;
    background: #345FA0;
    overflow-x: hidden;
}
.manTree {
    color:#f2f2f2;
    font-size:12px;
    margin:10px 0px 10px 5px;
}
.manTree div{
    padding: 5px;
    cursor:pointer;
    font-size:15px;
    white-space: nowrap;
}
.manTree div:hover{
background:#448FE0;
}
.manTree div.manCat-active{
    background:#88919c;
}
.manCat-sub {
margin-left: 5px;
font-size: 12px !important;
}
.manCat-sub-sub {
margin-left: 10px;
font-size: 12px !important;
}

/*manual right side*/
.manRight {
    position:absolute;
    right:0;
    top:0;
    bottom:0;
    left:150px;
    background: #f2f2f2;
    overflow:hidden;
}
.manInfo > div:not(:first-child){
    display:none;
}
.manHeader{
    position:absolute;
    left:0;
    right:0;
    top:0;
    height:15px;
    color:whitesmoke;
    background:#88919c;
    text-align:center; 
    padding-top:10px;
    padding-bottom:10px;
}
.manDoc{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    top:35px;
    overflow:auto;
}
.manDoc > .section, .sectionInfo > .section{
    font-weight: bold;
    padding: 10px;
}
.manDoc > .sectionInfo {
    padding: 5px 10px 5px 10px;
}
.manDoc div, .manDoc i, .manDoc li, .manDoc li b, .manDoc li i {
font-size: 13px;
}
.sectionInfo > ul li {
    margin-top:10px;
    margin-bottom:10px;
}
.sectionInfo .original{
    padding:1px;
}
.sectionInfo button{
    color:#414042;
}
.sectionInfo button:not(.original) {
    font-size:11px;
    padding:1px;
}
.sectionInfo input[type="checkbox"] {
    padding:0;
    margin:0;
    vertical-align:middle;
}

/* images*/
.sectionInfo ul li img {
height: 20px;
/*vertical-align: middle;*/
}
.sectionInfo .smallImg {
height: 20px;
vertical-align: middle;
}

/*interactive elements*/
/*mock-up header*/
.headerExample{
    white-space: nowrap;
    font-size:0 !important;
}
.headerExample .ui-sortable-placeholder{
    visibility:visible !important;
    background: #aaa;
}
.headColumn{
    font-size:13px;
    padding:4px;
    background: #e6e6e6;
    border-right: 1px solid silver !important;
    display:inline-block;
    list-style:none;
    cursor:pointer;
    color:rgb(85, 85, 85);
    height:24px;
    width: 75px;
    min-width: 50px;
    max-width:150px;
    white-space:nowrap;
    overflow: hidden;
    margin:0;
    padding:0;
}
.headColumn > div:not(.head-handle-e):not(.down){
    vertical-align:middle;
    margin-top:5px;
    margin-left: 10px;
}
.headColumn > .head-handle-e{
    position:absolute;
    width:10px;
    right:0;
    top:0;
    bottom:0;
}
.headColumn:hover{
    color:#013d98;
    background:#dddddd;
        
}
.stat{
    width:24px !important;
    min-width: 24px
}
.stat > .down{
    margin:8px 5px 1px 5px;
    padding:0;
    width: 0; 
	height: 0; 
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;	
	border-top: 8px solid #345FA0;
}

/*main menu tabs*/
.sectionInfo > div[role="tab"] {
    display:inline-block;
    position:relative;
    list-style:none;
    width: auto;
    border-color: ##9E9E9E;
}
.sectionInfo > div[role="tab"] > a {
    margin-left:1px;
    padding:5px;
    border: none !important;
    color: #414042;
}
/*context menu examples*/
.context-example > div{
    display:inline-block;
    padding:8px;
    margin:15px;
    outline:1px solid #345FA0;
    cursor:pointer;
}
    .context-example > div:hover {    
        background:#e6e6e6;
        color:#345FA0;
    }

/*###########*/
/*ABOUT DIALOG*/
/*###########*/
.aboutDialogWrap {    
}
.aboutHeader { 
margin-bottom: 10px;
border: 1px solid #4d749e;
background-image: -ms-linear-gradient(top, #EDF4FF 0%, #4D749E 100%);
background-image: -moz-linear-gradient(top, #EDF4FF 0%, #4D749E 100%);
background-image: -o-linear-gradient(top, #EDF4FF 0%, #4D749E 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #EDF4FF), color-stop(1, #4D749E));
background-image: -webkit-linear-gradient(top, #EDF4FF 0%, #4D749E 100%);
background-image: linear-gradient(to bottom, #EDF4FF 0%, #4D749E 100%);
color: #353535;
}
.aboutHeader > div {
    display:block;
    margin:5px;
    text-align:center;
    font-size: 14px;
    font-weight:bold;
}
.aboutHeader .aboutImage > img {
    display:block;
    margin-left: auto;
    margin-right: auto;    
}
.aboutDialogWrap .aboutTour {
    margin:15px;
    padding:5px;
    text-align:center;
    border:1px solid #1D68B3;
    border-radius: 3px;
    cursor:pointer;    
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}


.aboutDialogWrap .aboutFooter {
    background: #4D749E;
color: whitesmoke;
    padding-top:5px;
    padding-bottom:5px;
    margin-top:10px;
    
}
.aboutDialogWrap .aboutFooter > div {
    margin-left:12px;
}

/*about content*/
.aboutContent {
    max-height: 250px;
    overflow: auto;
    color: #353535;
}
.aboutContent div{
    display:block;    
}
.aboutContent > div:not(.aboutContact) > div{
    display:inline-block;    
    padding:5px;
    font-size:14px;
}
.aboutContent > div:not(.aboutContact):hover{
    color: #013d98;
    background: rgba(95, 122, 157, 0.30);
    
} 
.aboutContent > div:not(.aboutContact) > div:first-child{ 
    font-weight:bold;
    color: #4d749e;
    margin-right: 5px;
}

.aboutContent > div:not(.aboutContact) > a{ 
    outline:none;
    border:none;
    text-decoration:none !important;
    font-weight:bold;
    color: #f3972e;
}

.aboutContact{
    margin-left:10px;
}

.aboutContact > div{
    display:block;
    padding:5px;
}

.aboutContact > div > div{
    display:block;
    padding:2px;
}

.aboutContact > .aboutContactHeader{
    color: #f3972e;
    font-size: 13px;
    font-family: arial;
}
.aboutContact > div > div:first-child{
    color: #4d749e;
}

.aboutContact > div > div > a{
    text-decoration:none;
    color: #f3972e;
}
.aboutContact > div > div > a:hover{
    color: #4d749e;
}
.aboutContact > div > div:not(first-child){    
    display:inline-block;
}

/*###########*/
/*INFO BALLOONS*/
/*###########*/
.balloon-not-selectable {
    -moz-user-select: none;
    -html-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    cursor: default;
}

.infoBalloon {
    position: absolute;
    z-index: 1;
    cursor: default;
    /*background-image: -ms-linear-gradient(top, #F2F2F2 0%, #999999 100%);
    background-image: -moz-linear-gradient(top, #F2F2F2 0%, #999999 100%);
    background-image: -o-linear-gradient(top, #F2F2F2 0%, #999999 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #F2F2F2), color-stop(1, #999999));
    background-image: -webkit-linear-gradient(top, #F2F2F2 0%, #999999 100%);
    background-image: linear-gradient(to bottom, #F2F2F2 0%, #999999 200%);*/
    box-shadow: 3px 3px 3px #414042;
    color: #414042;
    background: #f2f2f2;
}

.infoBalloonNext {
    cursor: pointer;
    position: absolute;
    bottom: 0px;
    left: 0;
    right: 0;
    text-align: center;
    color: #013d98;
    font-weight: bolder;
    cursor: pointer;
}

.infoBalloon-nextText {
    margin: 7px;
}

.infoText {
    padding: 8px;
    margin-bottom: 25px;
    max-width: 300px;
    cursor: default;
}

.infoModal {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 10;
    background-color: rgba(65, 64, 66, .3);
    cursor: default;
}

.infoBalloon-clickAnywhere {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    background: transparent;
    cursor: default;
}

.arrow-left {
    position: absolute;
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-right: 12px solid #f2f2f2;
    cursor: default;
}

.arrow-right {
    position: absolute;
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-left: 12px solid #f2f2f2;
    cursor: default;
}

.arrow-top {
    position: absolute;
    width: 0;
    height: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid #f2f2f2;
    cursor: default;
}

.arrow-bottom {
    position: absolute;
    width: 0;
    height: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-top: 12px solid #f2f2f2;
    cursor: default;
}

/*################*/
/*CONFIG DIALOG*/
/*################*/
.xmlConfigTop, .xmlConfigBtm {
    display:block;
}
.xmlConfigBtm{
    margin-top:10px;
}
.xmlConfigHeader > img{
    margin-left:15px; 
}
.xmlConfigCat, .xmlConfigSett{
display:inline-block;
min-height: 100%;
vertical-align: top;
height:300px;
overflow:auto;
}
.xmlConfigCat{
    outline:1px solid #414042; 
    width:100px;  
    margin-right:5px;
    background:#fff; 
}
.xmlCatDiv{
    display:block;
    padding:7px 10px 7px 5px;
    cursor:pointer;
}
    .xmlCatDiv:hover {
        background:#82a2d1;
    }
    .xmlCatDiv.active {
        background:#4d749e;
        color:whitesmoke;
    }
.xmlConfigSett{
    outline:1px solid #414042;
    overflow-x:hidden;
}
.xmlConfigSett, .xmlConfigPage {
width: 375px;
}
.xmlConfigPage > div{
    display:block;
}
.xmlSettHeader{
    text-align:center;
    padding:7px;
    background: #4d749e;
    color: whitesmoke;
}
.xmlSettWrap{
    margin:15px 15px 5px 5px;
}
.xmlSettLbl, .xmlConfigInput{
    display:inline-block;
}
.xmlSettLbl{
    width:125px;
}
.xmlSettVal {
vertical-align: middle;
}